<template>
  <div class="crud_menu_right_custom_area">
    <el-tooltip class="crud_menu_right_custom_btn" effect="dark" content="暂存检索信息" placement="top-start">
      <el-switch v-model="cacheStatus" @change="changeCacheStatus"> </el-switch>
    </el-tooltip>
  </div>
</template>
<script>
export default {
  props: {
    name: {},
    cacheData: {}
  },
  computed: {
    stashCacheData() {
      const stashCache = localStorage.getItem(`PAGE_LEVEL_CACHE:${this.name}`);
      return stashCache;
    }
  },
  data() {
    return {
      cacheStatus: false
    };
  },
  mounted() {
    let status = localStorage.getItem('PAGE_LEVEL_CACHE_STATUS');
    if (status === 'true') {
      this.cacheStatus = true;
    } else {
      this.cacheStatus = false;
    }
  },
  methods: {
    changeCacheStatus(status) {
      localStorage.setItem(`PAGE_LEVEL_CACHE_STATUS`, status);
      if (!status) {
        this.clearPageStash();
      } else {
        this.$message.success('暂存检索信息功能已开启');
      }
    },
    setPageStash(params) {
      let status = localStorage.getItem('PAGE_LEVEL_CACHE_STATUS');
      if (status === 'true') {
        localStorage.setItem(`PAGE_LEVEL_CACHE:${this.name}`, JSON.stringify(params));
        this.$message.success('检索信息已暂存');
      }
    },
    clearPageStash() {
      localStorage.removeItem(`PAGE_LEVEL_CACHE:${this.name}`);
      this.$message.success('暂存检索信息功能已关闭');
    }
  }
};
</script>
<style scoped style="scss">
.crud_menu_right_custom_area {
  display: inline-flex;
}
.crud_menu_right_custom_btn {
  margin-right: 15px !important;
}
</style>
